<template>
    <div>
        <app-header></app-header>
        <app-navbar></app-navbar>
        <app-main></app-main>        
    </div>
</template>
<script>
import AppHeader from './AppHeader/index.vue'
import AppNavbar from './AppNavbar/index'
import AppMain from './AppMain'
export default {
    components:{
        AppHeader,
        AppNavbar,
        AppMain
    }
}
</script>
<style scoped>
.header{
    position: absolute;
    line-height: 50px;
    top:0px;
    left: 0px;
    right: 0px;
    background-color: #c76968;
}
.navbar{
    position: absolute;
    width: 200px;
    left: 0px;
    top: 50px;
    bottom: 0px;
    background-color: #769149;
    overflow-y: auto;
}
.main{
    position: absolute;
    left: 200px;
    right: 0px;
    bottom: 0px;
    top:50px;
    background-color: #ae6642;
    padding: 25px;
    overflow-y: auto;
}
</style>